/* eslint-disable react-hooks/exhaustive-deps */
import React, { useContext } from 'react'
import Summarize from './components/Summarize';
import Item from './components/Item';
import Course from './components/Project';
import { Row } from 'antd'
import Exercise from './components/Exercises';
import { useEffect } from 'react';
import { getCourseItemStatistics } from '@/services/gamePaperUser';
import { useState } from 'react';
import { CourseContext } from '..';
export default function Overview() {
  const [itemCount, setItemCount] = useState<any>();
  const [itemStarCount, setItemStarCount] = useState<any>();
  const ctx = useContext(CourseContext);

  useEffect(() => {
    (async () => {
      const res = await getCourseItemStatistics({ uid: ctx.uid, courseId: ctx.courseId });
      setItemCount(res?.result?.itemCount);
      setItemStarCount(res?.result?.itemStarCount);
    })()
  }, [ctx])
  return (
    <div>
      <Row justify="space-around" style={{ marginBottom: '15px', minHeight: '400px', width: '100%' }}>
        <Summarize itemCountInfo={itemCount} />
        <Item itemStarCount={itemStarCount} />
      </Row>
      <Row justify="space-around" style={{ marginBottom: '15px', minHeight: '400px', width: '100%' }}>
        <Course />
        <Exercise />
      </Row>
    </div>
  )
}
